<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>用户注册</title>
    <link rel="stylesheet" href="../layui/css/layui.css" th:href="@{/layui/css/layui.css}" media="all"/>
    <style>
        .wrap{
            /*width: 200px;*/
            /*height: 50px;*/
            margin: 0 auto;
            margin-top: 0px;
            z-index:2;
            position:relative;
            text-align:center;
            line-height:30px;
            background-color: #fff;
            font-size:16px;
        }
        .line{
            width: 99%;
            border: 1px solid #00a1d6;
            position: absolute;
        }
    </style>
</head>
<body>
<div style="background-color: #00a1d6;height: 114px;width: 100%;text-align: center;">
    <img  src="../img/back.png" >
</div>

<div style="text-align: center;height: 45px;width: 100%;" class="wrap">
        <h1>注册</h1>
        <div class="line" style="float: left"></div>
</div>

<form class="layui-form" action="" style="margin: auto;width: 400px;">
    <div class="layui-form-item" style="width: 600px">
        <div class="layui-input-inline">
            <input type="text" id="username" name="username" required  lay-verify="required|title" style="width: 400px;" placeholder="请输入用户名" autocomplete="off" class="layui-input">
        </div>
        <div class="layui-form-mid" style="color: #d32f2f;margin-left: 205px" id="usernameUp"></div>
    </div>
    <div class="layui-form-item" style="width: 600px">
        <div class="layui-input-inline">
            <input type="password" name="password" id="password" required  lay-verify="required|pass" style="width: 400px;" placeholder="请输入密码" autocomplete="off" class="layui-input">
        </div>
        <div class="layui-form-mid" style="color: #d32f2f;margin-left: 205px" id="passwordUp"></div>
    </div>

    <div class="layui-form-item" style="width: 600px">
        <div class="layui-upload">
            <div class="layui-input-inline" style="width: 90px">
                <button type="button" class="layui-btn layui-btn-normal layui-btn-radius" id="upImg">上传图片</button>
            </div>
            <input type="text" id="headImg" name="head"  style="width: 300px;margin-left: 0px" placeholder="图片名称" autocomplete="off" class="layui-input layui-btn-disabled">
            <div class="layui-upload-list">

                <img class="layui-upload-img" id="headImgUp" style="width: 160px;height: 90px;">
                <p id="demoText"></p>
            </div>
        </div>
    </div>

    <div class="layui-form-item" style="width: 600px">
        <div class="layui-inline">
            <div class="layui-input-inline">
                <input type="text" name="phone" id="phone" lay-verify="phone" placeholder="请输入手机号" style="width: 400px;" autocomplete="off" class="layui-input">
            </div>
            <div class="layui-form-mid" style="color: #d32f2f;margin-left: 205px" id="phoneUp"></div>
        </div>
    </div>
    <div class="layui-form-item" style="width: 600px">
        <div class="layui-inline">
            <div class="layui-input-inline">
                <input type="text" name="mobileCode" id="mobileCode" style="width: 305px;" placeholder="请输入短信验证码" autocomplete="off" class="layui-input">
            </div>
            <button type="button" id="codeBtn" style="margin-left: 110px" class="layui-btn layui-btn-normal layui-btn-radius">点击获取</button>
        </div>
    </div>
    <div class="layui-form-item" style="width: 600px">
        <div class="layui-input-inline">
            <input type="text" id="papers" name="papers" style="width: 400px;" lay-verify="identity" placeholder="请输入证件号" autocomplete="off" class="layui-input">
        </div>
        <div class="layui-form-mid" style="color: #d32f2f;margin-left: 205px" id="papersUp"></div>
    </div>
    <div class="layui-form-item" style="width: 600px">
        <div style="margin-left: 80px;width: 80px" class="layui-input-inline">
            <input type="checkbox" name="agree" id="agree" style="margin-right: 0px" title="我已同意" lay-skin="primary">
        </div>
        <div class="layui-form-mid" style="color: #1E9FFF;" id="agreement">《用户协议》</div>
    </div>
    <div class="layui-form-item" style="width: 600px">
        <div class="layui-input-block">
            <button type="submit" class="layui-btn layui-btn-normal layui-btn-radius" lay-submit lay-filter="register">立即注册</button>
            <button type="reset" class="layui-btn layui-btn-radius layui-btn-danger">清空表单</button>
        </div>
        <div class="layui-form-mid" style="margin-left: 265px" id="backLogin">
            <a style="color: #1E9FFF;" href="/Ticket/home/index">已有账号，直接登录></a>
        </div>
    </div>
</form>

</body>
<script type="text/javascript" src="../layui/layui.js" th:href="@{/layui/layui.js}"></script>
<script type="text/javascript" src="../js/register.js" th:href="@{/js/register.js}"></script>
</html>